<template>
  <el-row class="tac">
    <el-col :span="12">
      <el-menu
        default-active="2"
        class="el-menu-vertical-demo"
        @open="handleOpen"
        @close="handleClose"
        :router="true"
      >
        <el-menu-item index="/index/SystemSettings/Organization">
          <span slot="title">组织机构</span>
        </el-menu-item>
        <el-menu-item index="/index/SystemSettings/Role">
          <span slot="title">角色管理</span>
        </el-menu-item>
         <el-menu-item index="/index/SystemSettings/User">
          <span slot="title">用户管理</span>
        </el-menu-item>
        <el-menu-item index="/index/SystemSettings/Personage">
          <span slot="title">个人中心</span>
        </el-menu-item>
       
        <el-menu-item index="/index/SystemSettings/Dictionaries">
          <span slot="title">字典管理</span>
        </el-menu-item>
        <el-menu-item index="/index/SystemSettings/Sun">
          <span slot="title">阳光公正</span>
        </el-menu-item>
      </el-menu>
    </el-col>
  </el-row>
</template>
<script>
export default {
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>
<style lang="less" scoped>
/deep/.el-col {
  width: 198px !important;
  height: 100% !important;
}
/deep/.el-menu-item {
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
}
/deep/.el-menu-vertical-demo,
.el-menu {
  height: 100%;
}
/deep/.tac,
.el-row {
  height: 100%;
}
</style>